<template>
  <div>
    <div class="text-right">
      <el-button type="primary" class="text-4.5" @click="fabuxuqiu" size="large">发布融资需求</el-button>
    </div>
    <div class="mt-5">
      <div v-for="(item, i) in financeInfos" :key="i" class="border border-#eee mb-5">
        <div class="bg-#f7f7f7 p-5">
          <div class="text-4.5">
            <span>{{ item.enterpriseName || '企业名称' }}</span>
            <el-tag class="!text-4 !border !p-3.6 ml-8" type="warning">{{ transformDict('financingApplyType',
              item.applyState || '0') }}</el-tag>
          </div>
          <div class="mt-4 relative">
            <div class="inline-block text-center">
              <p class="text-4.5"> {{ item.applyAmountMin || 0 }}-{{ item.applyAmountMax || 0 }}万元</p>
              <p class="text-3.8 col9 mt-2">融资金额</p>
            </div>


            <div class="inline-block ml-8 text-center">
              <p class="text-4.5"> {{ item.maturityMin }}-{{ item.maturityMax }}月</p>
              <p class="text-3.8 col9 mt-2">融资期限</p>
            </div>

            <div class="inline-block ml-8 text-center">
              <p class="text-4.5"> {{ item.rateMin }}-{{ item.rateMax }}%</p>
              <p class="text-3.8 col9 mt-2">融资年利率</p>
            </div>

            <div class="inline-block ml-8 text-center">
              <p class="text-4.5"> {{ item.createTime }}</p>
              <p class="text-3.8 col9 mt-2">申请时间</p>
            </div>

            <div class="absolute -top-2 right-0">
              <el-button type="primary" @click="navTo('needsInfoPage', { id: item.id })">查看</el-button>
              <el-button type="primary" v-if="item.applyState != '4'" @click="cancelNeeds(item.id)">取消需求</el-button>
            </div>

          </div>

        </div>

        <div v-for="(info, j) in item.ocFinancingMatch" :key="j" class="p-5 flex items-center">
          <div class="inline-block ml-3 text-center">
            <p class="text-4.5"> {{ info.productName }}</p>
            <p class="text-3.8 col9 mt-2">金融产品</p>
          </div>
          <div class="inline-block ml-8 text-center">
            <p class="text-4.5 w-40 truncate"> {{ item.organizationName }}</p>
            <p class="text-3.8 col9 mt-2">金融机构</p>
          </div>
          <div class="inline-block ml-8 text-center">
            <p class="text-4.5  whitespace-nowrap"> {{ info.amountLimitLower }}-{{ info.amountLimitUpper }}万元</p>
            <p class="text-3.8 col9 mt-2">融资金额</p>
          </div>
          <div class="inline-block ml-8 text-center">
            <p class="text-4.5 whitespace-nowrap"> {{ info.loanPeriodLimitLower }}-{{ info.loanPeriodLimitUpper }}月</p>
            <p class="text-3.8 col9 mt-2">融资期限</p>
          </div>
          <div class="inline-block ml-8 text-center">
            <p class="text-4.5 whitespace-nowrap"> {{ info.interestRateLimitLower }}-{{ info.interestRateLimitUpper }}%
            </p>
            <p class="text-3.8 col9 mt-2 whitespace-nowrap">融资年化率</p>
          </div>
          <!-- <el-tag class="!text-4 !border !p-3.6 ml-8" type="warning">待授信</el-tag> -->
          <!-- <el-button class="!ml-auto" type="primary">立即申请</el-button> -->
        </div>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { useNavTo } from '@/hooks/navTo';
import { getfinanceInfoList } from '@/api/financeDemad';
import { cancelFinance } from '@/api/enterprise';
import { useDict, transformDict } from '@/hooks/dict';
const router = useRouter()
import useUserStore from '@/stores/user';
const { currEnterprise } = storeToRefs(useUserStore())
console.log(currEnterprise);

useDict('financingApplyType')

const financeInfos = ref([]);




const getData = () => {
  if (!currEnterprise?.value?.id) return
  getfinanceInfoList(currEnterprise.value.id).then((res) => {
    console.log(res);
    financeInfos.value = res.data || [];
  });
}

function cancelNeeds(id) {
  ElMessageBox.confirm('确定要取消该融资需求吗？', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(() => {
    cancelFinance(id).then((res) => {
      if (res.code === 200) {
        ElMessage.success('取消成功')
        getData()
      }
    })
  })
}

watch(() => currEnterprise?.value?.id, () => {
  getData()
}, { immediate: true })

onMounted(() => {
});

function fabuxuqiu() {
  if (currEnterprise.value?.examineResult === '2') {
    router.push({ name: 'needsFormPage' })
    return
  }
  ElMessage.warning('请先完成企业实名认证')
}

const { navTo } = useNavTo()
</script>
